<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        .box{ width:300px;height:200px;border: solid 1px black; }
    </style>
</head>
<body>
    <div class="box"></div>
</body>
<script>

    var oBox = document.querySelector(".box");

    document.onkeydown = function(eve){
        var e = eve || window.event;

        // console.log( e.keyCode || e.which );

        var code = e.keyCode || e.which

        // console.log( e.ctrlKey );
        // console.log( e.shiftKey );
        // console.log( e.altKey );
        // console.log( e.metaKey );

        if(code === 65){
            oBox.innerHTML += "按下了a键<br>";
        }
        if(code === 65 && e.ctrlKey){
            oBox.innerHTML += "按下了ctrl + a键<br>";
        }

        // oBox.innerHTML += "hello world<br>";
    }

    // 方向键：
    // 回车：
    // 空格：


    
</script>
</html>